import React from 'react'
import {Card, Spin, Button, Icon, Alert} from 'antd'
import './ui.less'

export default class Loadings extends React.Component {

    render() {
        const icon = <Icon type={'loading'}/>
        return <div>
            <Card title={"Spin用法"} className={""}>
                <Spin size={'small'}></Spin>
                <Spin/>
                <Spin size={'large'}></Spin>
                <Spin indicator={icon}/>
            </Card>

            <Card title={'内容遮罩'} className={'card-wrap'}>
                <Alert
                    message={"react"}
                    description={'你好呀!!'}
                    type={'info'}
                />
                <Spin>
                    <Alert
                        message={"react"}
                        description={'你好呀!!'}
                        type={'error'}
                    />
                </Spin>

                <Spin tip={'正在努力加载中...'}>
                    <Alert
                        message={"react"}
                        description={'你好呀!!'}
                        type={'error'}
                    />
                </Spin>
                <Spin tip={'正在努力加载中...'} indicator={icon}>
                    <Alert
                        message={"react"}
                        description={'你好呀!!'}
                        type={'error'}
                    />
                </Spin>
            </Card>
        </div>
    }
}